<template>
  <div>
    <CategorySelector :isForbidden="!isShowAttrList" />
    <!-- 属性相关 -->
    <el-card style="margin-top: 10px">
      <!-- <AttrList v-if="isShowAttrList" :visible.sync="isShowAttrList" /> -->
      <AttrList v-if="isShowAttrList" @setAttr="getAttrValue" @setIsShowAttrList="setIsShowAttrList" />
      <!-- <SaveAttr v-else :visible.sync="isShowAttrList" /> -->
      <SaveAttr v-else :attrValue="attrValue" @setIsShowAttrList="setIsShowAttrList" />
    </el-card>
  </div>
</template>

<script>
import AttrList from './components/AttrList.vue'
import SaveAttr from './components/SaveAttr.vue'
export default {
  name: 'Attr',
  components: {
    AttrList,
    SaveAttr
  },
  data() {
    return {
      isShowAttrList: true,
      attrValue: {} // Sku属性数据
    }
  },
  methods: {
    // 控制属性列表显示与隐藏
    setIsShowAttrList(val) {
      this.isShowAttrList = val
    },
    // 获取要修改的属性数据
    getAttrValue(obj) {
      this.attrValue = obj
    }
  }

}
</script>

<style></style>
